<!doctype html>
<html>
<head>
    <title>Socket.IO chat</title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body { font: 13px Helvetica, Arial; }
        div { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
        div input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
        div button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
        #messages { list-style-type: none; margin: 0; padding: 0; }
        #messages li { padding: 5px 10px; }
        #messages li:nth-child(odd) { background: #eee; }
    </style>

</head>
<body>
<ul id="messages"></ul>
<div >
    <input id="m" autocomplete="off" /><button onclick="send()">Send</button>
</div>
</body>
<script src="jquery.js"></script>
<script src="socket.io.js"></script>
<script>
    var now =Date.now();
    var roomId = String(now);
    console.log(roomId)
    var socket = io();
    socket.on(roomId, function(msg){
        $('#messages').append($('<li>').text(msg.msg))
    });
    function send() {
        //主动给服务器端发送信息
        var data = {"msg":JSON.parse($('#m').val()),"id":roomId};
        socket.emit("vip",data);
        $('#m').val('');
        //服务器端给客户端推送信息

    }
</script>
</html>